<!DOCTYPE html>
<html lang="en" ng-app="app">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>ng-tree</title>
    <link rel="stylesheet" href="./ngTree/ngTree.css">
    <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
    <link rel="stylesheet" href="./font-awesome-4.7.0/css/font-awesome.min.css">
    <style>
        .container {
            width: 90%;
            margin: 0 auto;
            display: flex;
            margin-top: 20px;
        }

        .container .box {

            flex: 1;
            box-sizing: border-box;
        }
    </style>
</head>

<body  >

    <div class="container" >
        <div class="box" ng-controller="treeController1">
            <div ng-tree treenodes="treeRootNodes1" on-expand="onExpand" setting='setting1' on-checkbox="check" ng-if="treeRootNodes1">
            </div>

            <button ng-click="submit1()">提交选中数据</button>
          

        </div>
        <div class="box" ng-controller="treeController2">
            <div ng-tree treenodes="treeRootNodes2" on-expand="onExpand" setting='setting2' on-checkbox="check"> </div>

            <button ng-click="submit2()">提交选中数据</button>
        </div>
        <div class="box" ng-controller="treeController3">
            <div ng-tree treenodes="treeRootNodes3" on-expand="onExpand" setting='setting3' on-checkbox="check"> </div>

            <button ng-click="submit3()">提交选中数据</button>
        </div>
        <div class="box" ng-controller="treeController4">
            <div ng-tree treenodes="treeRootNodes4" on-expand="onExpand" setting='setting4' on-checkbox="check"> </div>

            <button ng-click="submit4()">提交选中数据</button>
            
        </div>
    </div>
    
    
</body>

<script src="angular.js "></script>
<script src="./ngTree/ngTree.js "></script>
<script src="app.js "></script>

</html>